<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>计分日志 - 班级积分管理</title>
    <link rel="icon" type="image/png" href="./assets/icon.png">
    <!-- Tailwind CSS -->
    <script src="./lib/tailwindcss@3.js"></script>
    <link rel="stylesheet" href="./lib/daisyui@4.7.2.css">

    <script src="./lib/alpinejs@3.js" defer></script>

    <style>
      ::-webkit-scrollbar {
        width: 0px;
      }
    </style>
</head>
<body x-data="app()">
    <div class="navbar bg-base-100 shadow-sm">
      <div class="navbar-start">
        <div class="dropdown">
          <div tabindex="0" role="button" class="btn btn-ghost lg:hidden">
              <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h8m-8 6h16" /> </svg>
            </div>
            <ul
              tabindex="0"
              class="menu menu-sm dropdown-content bg-base-100 rounded-box z-1 mt-3 w-52 p-2 shadow">
              <li><a href="/">首页</a></li>
              <li><a href="/operations.html">计数日志</a></li>
              <li><a href="/operations.html">更多操作</a></li>
            </ul>
          </div>
          <a class="btn btn-ghost text-xl">
            <img src="./assets/icon.png" class="w-8" alt="">
            班级积分管理
          </a>
        </div>
        <div class="navbar-center hidden lg:flex">
          <ul class="menu menu-horizontal px-1  w-[20rem] flex justify-between">
            <li><a href="/">首页</a></li>
            <li><a href="log.html">计分日志</a></li>
            <li><a href="operations.html">更多操作</a></li>
          </ul>
        </div>
        <div class="navbar-end">
          <a href="ai.html" class="btn">AI 辅助分析</a>
        </div>
    </div>
    <main class="flex-col flex justify-center items-center p-10">
        <!-- 头部功能 -->
        <div class="flex justify-between rounded-box border border-base-content/5 bg-base-100 w-9/12 shadow-sm p-6">
          <input x-model="searchQuery" type="text" placeholder="搜索名字 查看相关记录" class="input input-bordered"/>
        </div>
        <!-- 表格 -->
        <div class="overflow-x-auto rounded-box border border-base-content/5 bg-base-100 w-9/12 mt-10">
          <table class="table">
            <!-- head -->
            <thead>
              <tr>
                <th></th>
                <th class="text-base">时间</th>
                <th class="text-base">学号</th>
                <th class="text-base">姓名</th>
                <th class="text-base">计分描述</th>
                <th class="text-base">变动后学分</th>
              </tr>
            </thead>
            <tbody>
                <template x-for="(log, index) in filteredStudent">
                  <tr>
                    <th x-text="index + 1"></th>
                    <td x-text="log.time"></td>
                    <td x-text="log.id"></td>
                    <td x-text="log.name"></td>
                    <td x-text="log.description"></td>
                    <td x-text="log.credits"></td>
                  </tr>
                </template>
            </tbody>
          </table>
        </div>
      </main>

      <script src="./js/log.js"></script>
</body>
</html>